<template>
  <el-dialog
      v-model="typeDetailWinDialogVisible"
      title="详情工装夹具类型"
      width="60%"
      @close="handleClose"
      draggable
      center
  >
    <template #default>
      <el-descriptions>
        <el-descriptions-item label="类型编码">{{ type.typeEncode }}</el-descriptions-item>
        <el-descriptions-item label="类型名称">{{ type.typeName }}</el-descriptions-item>
        <el-descriptions-item label="是否编码管理">
          <el-tag type="success" v-if="type.typeStatus == 1">是</el-tag>
          <el-tag type="success" v-else>否</el-tag>
        </el-descriptions-item>
        <el-descriptions-item label="保养周期">{{type.typeFrequency}}</el-descriptions-item>
        <el-descriptions-item label="保养维护类型">
          <el-tag type="primary" v-if="type.typeType == 1">定期维护</el-tag>
          <el-tag type="success" v-else>按使用次数维护</el-tag>
        </el-descriptions-item>
        <el-descriptions-item label="备注">
          <div v-html="type.typeRemark"></div>
        </el-descriptions-item>
      </el-descriptions>
    </template>
  </el-dialog>
</template>

<script setup>
import {ref, watch} from "vue";
import typeRequest from "@/api/type.js";
// 申明组件的属性
const props = defineProps(['typeId']);
const emits = defineEmits(['cancelDetail'])
let typeDetailWinDialogVisible = ref(false);
// 详情对象
let type = ref({})

function handleClose(){
  emits("cancelDetail");
}
function loadTypeById() {
  typeRequest.selectById(props.typeId, res => {
    if (res.data) {
      type.value = res.data;
      typeDetailWinDialogVisible.value = true;
    }
  });
}

// 属性侦听
watch(() => props.typeId, () => {
  loadTypeById();
});
</script>

<style scoped>

</style>